<template>
  <a-card :bordered="false">
    <a-spin :spinning="confirmLoading">
      <a-form-model form="form" :model="model" :rules="validatorRules">
        <!--<a-form-model-item style="margin-left: -300px" label="采集周期" prop="setting" :labelCol="labelCol"-->
                           <!--:wrapperCol="wrapperCol">-->
          <!--<a-input v-model="model.setting" onkeyup="this.value=this.value.replace(/[^?\d]/g,'').replace(/^0{1,}/g,'')" placeholder="请输入采集周期时间"  />-->
        <div>
          <p style="font-size: large">请输入采集周期时间:
          <a-input-number v-model="model.setting"></a-input-number>
          秒
          <a-button type="primary" style="margin-left: 40px" icon="save" @click="handleSubmit">保存</a-button></p>
        </div>
        <!--</a-form-model-item>-->
      </a-form-model>
    </a-spin>
  </a-card>
</template>

<script>
import {settingGet,settingPost} from '@/api/api'

export default {
  name: "UserSetting",
  data () {
    return {
      visible: false,
      confirmLoading: false,
      confirmDirty: false,
      validatorRules:{


        setting:{
          rules: [{
            required: true, message: '请输入采集周期'
          }],
        },
      },

      model: {setting:10},

      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
      form:this.$form.createForm(this)
    }
  },
  created () {
    console.log("created");
    this.init()
  },

  methods: {
    init(){
      settingGet().then((res)=>{
        if(res.success){
          this.$emit('ok');
          this.model.setting = res.result
        }else{
          this.$message.warning(res.message);
        }
      })
    },
    show (username) {
      this.form.resetFields();
      this.visible = true;
      this.model.username = username;
      this.$nextTick(() => {
        this.form.setFieldsValue({username:username});
      });
    },
    close () {
      this.$emit('close');
      this.visible = false;
      this.disableSubmit = false;
      this.selectedRole = [];
    },
    handleSubmit () {
      // 触发表单验证
      this.form.validateFields((err, values) => {
        if (!err) {
          this.confirmLoading = true;
          let formData = Object.assign(this.model, values);
          settingPost(formData).then((res)=>{
            if(res.success){
              this.$message.success("保存成功");
              this.$emit('ok');
            }else{
              this.$message.warning(res.message);
            }
          }).finally(() => {
            this.confirmLoading = false;
          });
        }
      })
    },
    handleCancel () {
      this.close()
    },
    validateToNextPassword  (rule, value, callback) {
      const form = this.form;
      const confirmpassword=form.getFieldValue('confirmpassword');
      console.log("confirmpassword==>",confirmpassword);
      if (value && confirmpassword && value !== confirmpassword) {
        callback('两次输入的密码不一样！');
      }
      if (value && this.confirmDirty) {
        form.validateFields(['confirm'], { force: true })
      }
      callback();
    },
    compareToFirstPassword  (rule, value, callback) {
      const form = this.form;
      if (value && value !== form.getFieldValue('password')) {
        callback('两次输入的密码不一样！');
      } else {
        callback()
      }
    },
    handleConfirmBlur  (e) {
      const value = e.target.value
      this.confirmDirty = this.confirmDirty || !!value
    }
  }
}
</script>